<template>
  <el-popover
      trigger="click"
      width="500"
      placement="bottom-start"
  >
    <template #reference>
      <el-input v-model="iconValue" :placeholder="placeholder"></el-input>
    </template>
    <template #default>
      <el-input placeholder="请输入图标名称"></el-input>

    </template>
  </el-popover>
</template>

<script lang="ts">
export default {
  name: "InputIcon"
}
</script>

<script setup lang="ts">
import {computed, reactive} from "vue"
// noinspection TypeScriptValidateTypes
const props = withDefaults(defineProps<{
  value: string,
  placeholder: string
}>(), {
  placeholder: "请选择菜单图标",
})

const emit = defineEmits<{
  (event: 'value:update', value: string): void
}>()

const iconValue = computed({
  get() {
    return props.value
  },
  set(value: string) {
    emit("value:update", value)
  }
})

const iconList = reactive<string[]>([])


</script>

<style scoped lang="scss">

</style>
